<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
		<title>影视元宇宙</title>
		<link rel="stylesheet" href="./bootstrap-4.6.1-dist/css/bootstrap.min.css" />
		<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.0/font/bootstrap-icons.css">
		<link rel="stylesheet" href="./css/主页.css">
		<script>
			//iframe框架的调节
			function adjustIframe() {
				var ifm = document.getElementById("bi_iframe");
				ifm.height = document.documentElement.clientHeight - document.getElementById("headers").clientHeight;
				ifm.width = document.documentElement.clientWidth - document.getElementById("sidebarMenu").clientWidth;
			}
		</script>
	</head>
	<body>
		<header id="headers" class="navbar navbar-dark sticky-top  flex-md-nowrap p-0 shadow"
			style="background-color: #4d4d4d;">
			<!-- 头标 -->
			<a class="navbar-brand col-md-3 col-lg-2 me-0 px-3 fs-6" href="#"><i class="text-primary">影视元宇宙</i> <svg
					xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor"
					class="bi bi-camera-reels-fill" viewBox="0 0 16 16">
					<path d="M6 3a3 3 0 1 1-6 0 3 3 0 0 1 6 0z" />
					<path d="M9 6a3 3 0 1 1 0-6 3 3 0 0 1 0 6z" />
					<path
						d="M9 6h.5a2 2 0 0 1 1.983 1.738l3.11-1.382A1 1 0 0 1 16 7.269v7.462a1 1 0 0 1-1.406.913l-3.111-1.382A2 2 0 0 1 9.5 16H2a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h7z" />
				</svg><b style="position: relative;left: 55pt;">Joshua</b></a>

			<!-- 折叠栏 -->
			<button class="navbar-toggler position-absolute d-md-none collapsed" type="button" data-toggle="collapse"
				data-target="#sidebarMenu">
				<span class="navbar-toggler-icon "></span>
			</button>

			<!-- 表单的内嵌 -->
			<div class="navbar-nav  ml-auto">
				<form class="form-inline" action="#">
					<input class="form-control form-control-dark " type="text" placeholder="enter search video name"
						id="search" />
					<button id="btnsearch" type="submit" class="btn btn-light"><i
							class="bi bi-search-heart-fill"></i></button>
				</form>
			</div>
		</header>

		<!-- 导航栏 -->
		<nav id="sidebarMenu" class="col-md-3 col-lg-2 d-md-block sidebar collapse " style="background-color: #4d4d4d;">
			<div class="position-sticky pt-3 sidebar-sticky">


				<ul class="nav flex-column">
					<li class="nav-item">
						<a class="nav-link active" href="./carousel.html" target="mainshow">
							<i class="bi bi-house-heart-fill align-text-bottom"></i>
							主页
						</a>
					</li>
				</ul>


				<h6
					class="sidebar-heading d-flex justify-content-between align-items-center px-3 mt-4 mb-1 text-muted text-uppercase">
					<span>影视分类</span>
					<a class="link-secondary" href="#">
						<i class="bi bi-file-earmark-play-fill " style="position: relative;right: 75pt;"></i>
					</a>
				</h6>


				<ul class="nav flex-column">
					<li class="nav-item">
						<a class="nav-link active" href="./喜剧.html" target="mainshow">
							<i class="bi bi-emoji-smile-upside-down-fill align-text-bottom"></i>
							喜剧
						</a>
					</li>
					<li class="nav-item">
						<a class="nav-link active" href="./战争.html" target="mainshow">
							<i class="bi bi-airplane-engines-fill align-text-bottom"></i>
							战争
						</a>
					</li>
					<li class="nav-item">
						<a class="nav-link active" href="./爱情.html" target="mainshow">
							<i class="bi bi-hearts align-text-bottom"></i>
							爱情
						</a>
					</li>
				</ul>

				<h6
					class="sidebar-heading d-flex justify-content-between align-items-center px-3 mt-4 mb-1 text-muted text-uppercase">
					<span>个人信息</span>
					<a class="link-secondary active" href="#">
						<i class="bi bi-person-heart " style="position: relative;right: 75pt;"></i>
				</h6>

				<ul class="nav flex-column mb-2">
					<li class="nav-item">
						<a class="nav-link active" href="./个人信息.html" target="mainshow">
							<i class="bi bi-house-heart-fill align-text-bottom"></i>
							个人主页
						</a>
					</li>
					<li class="nav-item">
						<a class="nav-link active" href="./收藏.html" target="mainshow">
							<i class="bi bi-box2-heart-fill align-text-bottom"></i>
							收藏夹
						</a>
					</li>
				</ul>

				<h6
					class="sidebar-heading d-flex justify-content-between align-items-center px-3 mt-4 mb-1 text-muted text-uppercase">
					<span>资源上传</span>
					<a class="link-secondary active" href="#">
						<i class="bi bi-person-heart " style="position: relative;right: 75pt;"></i>
				</h6>

				<ul class="nav flex-column mb-2">
					<li class="nav-item">
						<a class="nav-link active" href="./上传影视资源.html" target="mainshow">
							<i class="bi bi-person-video2 align-text-bottom"></i>
							电影上传
						</a>
					</li>

				</ul>
			</div>
		</nav>
		<!-- 调整ifram框架的大小 -->
		<iframe id="bi_iframe" src="./carousel.html" onload="adjustIframe();" frameborder="0" scrolling="auto"
			name="mainshow" style="left: 197px; position: relative;top: 1pt;">
		</iframe>
		<script src="./js/jquery-3.6.1.js"></script>
		<script src="./bootstrap-4.6.1-dist/js/bootstrap.bundle.js"></script>


		<script>
			$("#btnsearch").click(function() {

				var search = $("#search").val();
				$.ajax({
					url: "http://127.0.0.1:8080/searchfilmbyname",
					data: {
						name: search
					},
					type: "get",
					dataType: "json",
					success: function(result) {
						alert("find and show");
						window.open(result.videourl);
						$("#search").val(null);
					},
					error: function(err) {
						console.log(err);
					},

				});

			});
		</script>



	</body>
</html>
